



<template>
  <div class="list">
    <div v-if="list.length>0">
      <div class="item" v-for="(item,index) in list" :key="index">
          <router-link class="link" :to="{name:'offer-detail',params:{id:item._id},query:{name:item.name}} ">
              <div class="item-box">
                  <div class="line">
                      <div class="name center" v-if="item.uesrInfo" >
                        <van-icon name="user-o" /> {{ item.uesrInfo.username }}
                      </div>
                      <div class="date center " >
                        入职时间:
                        <span >{{ item.time | timeFormat(true) }}</span>
                      </div>
                  </div>
                  <div class="title mt5 row">
                    OFFER名称: <span>{{ item.name }}</span>
                  </div>
                  <div class="title mt5 row">
                    公司名称: <span>{{ item.company }}</span>
                  </div>
                  <div class="time mt5 row">
                    入职薪资:  <span >{{ item.salary }}</span>
                  </div>
                  <div class="campany mt5 row">
                    入职提醒: <span>{{ item.tips }}</span>
                  </div>


                  <div class="imgs mt5 row">
                    <p v-if="item.desc">OFFER照片:</p>
                    <div class="mt5" v-if="item.desc">
                      <img class="bigimg" v-lazy="item.desc.replace(/public/,baseURL)"   alt="">
                    </div>
                  </div>
              </div>
          </router-link>
      </div>
    </div>
    <div class="empty mt20" v-else>
      <van-empty
        class="custom-image"
        image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
        description="暂无任何OFFER记录"
      />
    </div>

  </div>
</template>


<script>
export default {
  props:['list','type','noques'],
  data(){
    return {

    }
  },
  methods:{

  },
  mounted(){

  }
}
</script>

<style lang="scss" scoped >
.title, .campany , .address{
  color:#000;
  font-size:16px;
  font-weight: 500;
}
.audio{
  background:#fff;
  padding:8px;
  display: flex;
  justify-content: center;
}
.actions{
  border-top:0.5px solid #ddd;
  width:100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding-top:10px;

}
.imgs{
    min-height:30px;
    .sbox{
      display: flex;
      flex-wrap: wrap;
      width:100%;
    }
    .simg{
      width:100px;
      height:100px;
      border-radius: 10px;
      margin:0px 10px 10px 0;
    }
  .bigimg{
    width:100%;
    height:300px;
    border-radius: 10px;
  }
}
.tag{
  margin:3px 3px 0 0 ;
}
.center{
  display: flex;
  justify-content: center;
  align-items: center;
}
.list{
  padding:0px 15px 15px;
  .item{
    margin-top:20px;
    background: #f4f4f4;
    border-radius: 10px;
    padding:10px;

    .link{
      color:#666;
      .line{
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom:0.5px solid #ddd;
        padding-bottom:5px;
      }
      .name{
        font-weight: 600;
      }
      .row{
        .icon{
          margin-right:4px;
        }
      }
    }
  }
}
</style>
